<script setup lang="ts">
const firstName = defineModel('firstName', {default: '张'});
// const lastName = defineModel('lastName', {default: '三'});
//修饰符
const [lastName, modifier] = defineModel('lastName', {
  default: '',
  set(value) {
    if (modifier.capitalize) {
      return value.charAt(0).toUpperCase() + value.slice(1)
    }
    return value;
  }
});
</script>

<template>
  <div class="border rounded-3 p-3 ">
    <p>子组件：{{ firstName }} {{ lastName }}</p>
    <span>姓</span>
    <input type="text" v-model="firstName">
    <span>名</span>
    <input type="text" v-model="lastName">

  </div>
</template>

<style scoped>

</style>